import React, { Component } from 'react';
import '../styles/Login.scss'
import {Form,Input,Button,Toast} from 'antd-mobile'
import * as service from '../api/index'

class Login extends Component {
   async denglu(){
    var res = await this.refs.formRef.validateFields()
        var res1 = await service.user_user()
        var i = res1.data.find((item) => {
            return item.phone == res.phone
        })
        if (i) {
            Toast.show({
                icon: 'success',
                content: '登录成功',
            })
            this.props.history.push('/index')
            
        } else {
            Toast.show({
                icon: 'fail',
                content: '登录失败',
            })
        }
   }
    render() {
        return (
            <div className='login'>
                <Form layout='horizontal'
                ref='formRef'
                    footer={
                        <Button block type='submit' color='primary' size='large' onClick={() => { this.denglu() }}>
                            登录
                        </Button>
                    }>
                    <Form.Header>登录页面</Form.Header>
                    <Form.Item
                        name='name'
                        label='用户名'
                        rules={[{ required: true, message: '用户名不能为空' }]}
                    >
                        <Input type='text' placeholder='请输入用户名' />
                    </Form.Item>
                    <Form.Item
                        name='pass'
                        label='密码'
                        rules={[{ required: true, message: '密码不能为空' }]}
                    >
                        <Input type='password' placeholder='请输入密码' />
                    </Form.Item>
                </Form>
                <div className='zi' onClick={()=>{this.props.history.push('/register')}}>注册</div>
            </div>
        );
    }
}

export default Login;